import { PageDto } from "../../../models/page.model";
import { TriggerColorStrMap, TriggerStrMap, TriggerTypeLogoMap, UaCard, UaCardSearchRequest } from "../../../models/ua-card.model";
import { GlobalService } from "../../../services/global.service";
import { UaCardService } from "../../../services/ua-card.service";

// pages/home/single-card-search/single-card-search.page.ts
Page({

  /**
   * 页面的初始数据
   */
  data: {
    cardList: [] as UaCard[],
    popupVisible: false,
    hasMore: false,
    display: true,
    gridMode: true,
    cardKeyWords: '',
    FILE_HOST: GlobalService.STATIC_ASSETS_HOST,
    TriggerTypeLogoMap: TriggerTypeLogoMap,
    TriggerStrMap: TriggerStrMap,
    TriggerColorStrMap: TriggerColorStrMap,
    defaultSearchRequest: {
      needEnergyCountMin: 0,
      needEnergyCountMax: 15,
      needEnergyType: undefined,
      bpMax: 10000,
      bpMin: 0,
      generateEnergyCountMax: 3,
      generateEnergyCountMin: 0,
      generateEnergyType: undefined,
      needApMin: 1,
      needApMax: 2,
      cardCategory: undefined,
      triggerType: undefined,
      attribute: undefined,
      packNo: undefined,
      cardKeyWords: undefined,
    } as UaCardSearchRequest,
    detailVisible: false,
    detailCard: {} as UaCard
  },

  customData: {
    page: 1,
    totalPage: 1,
    searchRequest: {
      needEnergyCountMin: 0,
      needEnergyCountMax: 15,
      needEnergyType: undefined,
      bpMax: 10000,
      bpMin: 0,
      generateEnergyCountMax: 3,
      generateEnergyCountMin: 0,
      generateEnergyType: undefined,
      needApMin: 1,
      needApMax: 2,
      cardCategory: undefined,
      triggerType: undefined,
      attribute: undefined,
      packNo: undefined,
      cardKeyWords: undefined,
    } as UaCardSearchRequest,
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options: any) {
    wx.setNavigationBarTitle({
      title: '卡片检索'
    });
    this.setData({
      cardKeyWords: options.search,
      defaultSearchRequest: options.search
    });
    this.customData.searchRequest.cardKeyWords = !!options.search ? options.search : undefined;
    // this.refresh();
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {
    this.onLoadMore();
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  },


  openPopup() {
    this.setData({
      popupVisible: true
    });
  },

  onPopupVisibleChange(e: any) {
    this.setData({
      popupVisible: e.detail.visible,
    });
  },

  load() {
    if (!this.customData.searchRequest.needEnergyType) {
      this.customData.searchRequest.needEnergyType = undefined;
    }
    if (!this.customData.searchRequest.generateEnergyType) {
      this.customData.searchRequest.generateEnergyType = undefined;
    }
    if (!this.customData.searchRequest.packNo) {
      this.customData.searchRequest.packNo = undefined;
    }
    if (!this.customData.searchRequest.attribute) {
      this.customData.searchRequest.attribute = undefined;
    }
    if (!this.customData.searchRequest.rare) {
      this.customData.searchRequest.rare = undefined;
    }
    if (!this.customData.searchRequest.cardCategory) {
      this.customData.searchRequest.cardCategory = undefined;
    }
    if (!this.customData.searchRequest.cardKeyWords) {
      this.customData.searchRequest.cardKeyWords = undefined;
    }
    if (this.isObjEq(this.customData.searchRequest, this.data.defaultSearchRequest)) {
      this.reset();
      return;
    }
    UaCardService.searchWithPage(this.customData.searchRequest, this.customData.page).then((response: PageDto<UaCard>) => {
      this.customData.totalPage = response.meta!.pageCount!;
      if (this.customData.page === 1) {
        this.setData({
          cardList: response.data,
          hasMore: this.customData.page < this.customData.totalPage
        })
      } else {
        this.setData({
          cardList: [...this.data.cardList, ...response.data!],
          hasMore: this.customData.page < this.customData.totalPage
        })
      }
    });
  },

  onSearch(e: any) {
    this.customData.searchRequest = e.detail;
    this.refresh();
    // if (!!e.detail.value) {
    //   this.setData({
    //     cardKeyWords: e.detail.value
    //   })
    //   this.customData.searchRequest.cardKeyWords = e.detail.value;
    //   this.refresh();
    // } else {
    //   this.reset();
    // }
  },

  refresh() {
    this.customData.page = 1;
    this.load();
  },

  onLoadMore() {
    if (!this.data.hasMore) {
      return;
    }
    this.customData.page++;
    this.load();
  },

  reset() {
    this.setData({
      cardList: [],
      cardKeyWords: '',
      hasMore: false
    });
    this.customData.searchRequest = JSON.parse(JSON.stringify(this.data.defaultSearchRequest));
    this.customData.page = 1;
    this.customData.totalPage = 1;
  },

  changeMode() {
    this.setData({
      gridMode: !this.data.gridMode
    })
  },

  isObjEq(a: any, b: any) {
    const p1 = Object.getOwnPropertyNames(a);
    const p2 = Object.getOwnPropertyNames(b);
    if (p1.length !== p2.length) {
      return false;
    }
    for (const k of p1) {
      if (a[k] !== b[k]) {
        return false;
      }
    }
    return true;
  },

  openDetail(e: any) {
    for (const card of this.data.cardList) {
      if (card.id === e.detail) {
        this.setData({
          detailVisible: true,
          detailCard: card
        });
        break;
      }
    }
  },

  onDetailVisibleChange(e: any) {
    this.setData({
      detailVisible: e.detail.visible,
    });
  },

  onPrev(e: any) {
    const detailCardId = e.detail;
    let p = 0;
    for (let i = 0; i < this.data.cardList.length; i++) {
      if (detailCardId === this.data.cardList[i].id) {
        p = i;
        break;
      }
    }
    if (p === 0) {
      p = this.data.cardList.length - 1;
    } else {
      p--;
    }
    this.setData({
      detailCard: this.data.cardList[p]
    })
  },

  onNext(e: any) {
    const detailCardId = e.detail;
    let p = 0;
    for (let i = 0; i < this.data.cardList.length; i++) {
      if (detailCardId === this.data.cardList[i].id) {
        p = i;
        break;
      }
    }
    if (p === this.data.cardList.length - 1) {
      p = 0;
    } else {
      p++;
    }
    this.setData({
      detailCard: this.data.cardList[p]
    })
  }

})